import BaseComponent from "http://component.119safe.cn/component/base.js";

new class Button_Dropdown extends BaseComponent
{
	/*
	 * color	7种颜色(dark，grey，red，purple，green，light-blue，其它值为dark-blue但点击时透明)
	 * icon		图标(font-awesome class)
	 * text		按钮文本
	 * header	头部html
	 * footer	尾部html
	 */
	Properties = { "color": "", "icon": "", "text": "", "header": "", "footer": "" };

	InnerContainer = "ul[container]";

	render() { super.render(this.constructor.name); }

	Content = `
<li class="{color} dropdown-modal">
	<a data-toggle="dropdown" class="dropdown-toggle" href="">
		<i class="ace-icon fa {icon}"></i>
		<span class="badge badge-transparent" style="margin-top:5px">{text}</span>
	</a>

	<ul class="dropdown-menu-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
		<li class="dropdown-header">{header}</li>

		<li class="dropdown-content ace-scroll" style="position: relative;">
			<div class="scroll-track" style="display: none;"><div class="scroll-bar"></div></div><div class="scroll-content" style="max-height: 200px;">
				<ul container class="dropdown-menu dropdown-navbar"></ul>
			</div>
		</li>

		<li class="dropdown-footer">{footer}</li>
	</ul>
</li>
`;
}().render();
